<template>
  <view class="content-in">
    <AnswersStart v-if="answersStatus === EnumAnswers.STATUS" v-model:answersStatus="answersStatus" />
    <AnswersInput v-if="answersStatus === EnumAnswers.INPUT"  v-model:answersStatus="answersStatus"  v-model:answers="answers" />
    <AnswersResult v-if="answersStatus === EnumAnswers.RESULT"   v-model:answersStatus="answersStatus" :answers="answers"/>
  </view>
   
  <Roast  />
  <Recommend   :top='answersStatus === EnumAnswers.RESULT ? 90 : 100' />
  <ToDY />
</template>
<script setup lang="ts">
import { EnumAnswers } from "./content";
import AnswersStart from "./components/AnswersStart.vue";
import AnswersInput from "./components/AnswersInput.vue";
import AnswersResult from "./components/AnswersResult.vue";
import Roast from "@/components/Roast/Roast.vue";
import Recommend from "@/components/Recommend/Recommend.vue";
import ToDY from "@/components/ToDY/ToDY.vue";
const answersStatus = ref<EnumAnswers>(EnumAnswers.STATUS)
const answers = ref("")

</script>

<style>
page {
  width: 100%;
  height: 100%;
}
.content-in{
  width: 100%;
  height: 100vh; /* 视口高度 */
}
</style>